<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">

    <title>氿阳上位控制系统</title>
    <meta name="keywords" content="氿阳上位控制系统">
    <meta name="description" content="氿阳上位控制系统">

    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>
    <![endif]-->


    <link rel="shortcut icon" th:href="@{/favicon_new.ico}">
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet">
    <link th:href="@{/css/font-awesome.css}" rel="stylesheet">

    <link th:href="@{/css/animate.css}" rel="stylesheet">
    <link th:href="@{/css/style.css}" rel="stylesheet">
    <link th:href="@{/self/self-common.css}" rel="stylesheet">
</head>

<body class="fixed-sidebar full-height-layout gray-bg skin-purple" style="overflow:hidden">
<div id="wrapper">
    <!--左侧导航开始-->
    <nav class="navbar-default navbar-static-side" role="navigation">
        <div class="nav-close"><i class="fa fa-times-circle"></i>
        </div>
        <div class="sidebar-collapse">
            <ul class="nav" id="side-menu">
                <li class="nav-header">
                    <div class="dropdown profile-element">
                        <span><img alt="image" class="img-rounded" th:src="@{/img/logo_new.png}"/></span>
                        <!--   <span><img alt="image" class="img-rounded" th:src="@{/img/profile_small.jpg}"/></span>-->
                        <!--                        <span><img alt="image" class="img-shadow" th:src="@{/img/profile_small.jpg}"/></span>-->
                        <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                                <span class="clear">
                                   <span class="block m-t-xs"><strong class="font-bold"><h3 id="account"></h3></strong></span>
                                    <span class="text-muted text-xs block" id="roleName"></span><b class="fa fa-pencil-square-o" onclick="initTotal()"></b>

                                </span>
                        </a>
                        <!--                        <ul class="dropdown-menu animated fadeInRight m-t-xs">-->
                        <!--                            <li><a class="J_menuItem" href="form_avatar.html">修改头像</a>-->
                        <!--                            </li>-->
                        <!--                            <li><a class="J_menuItem" href="profile.html">个人资料</a>-->
                        <!--                            </li>-->
                        <!--                            <li><a class="J_menuItem" href="contacts.html">联系我们</a>-->
                        <!--                            </li>-->
                        <!--                            <li class="divider"></li>-->
                        <!--                            <li><a href="/cpi/loginOut">安全退出</a>-->
                        <!--                            </li>-->
                        <!--                        </ul>-->
                    </div>
                    <div class="logo-element">rh</div>
                </li>
                <!--                <li>-->
                <!--                    <a th:href="@{/cpiView/index1}"><i class="fa fa-desktop"></i> <span class="nav-label">看板</span><span-->
                <!--                            class="fa arrow"></span></a>-->
                <!--                </li>-->
            </ul>
        </div>
    </nav>
    <!--左侧导航结束-->


    <!--修改密码弹窗-->
    <div class="modal inmodal fade" id="changePassword">
        <div class="modal-dialog" style="margin-top:8%">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">修改密码</h4>
                    <button type="button" class="close" data-dismiss="modal">×</button>
                </div>

                <div class="modal-body">
                    <div class="col-md-12">

                        <div class="form-group">
                            <label class="col-sm-4 control-label"><b class="red">*</b>登录账号：</label>
                            <div class="col-sm-7">
                                <input id="accountChange" type="text" name="" class="form-control"
                                       placeholder="请输入登录账号" readonly>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-4 control-label"><b class="red">*</b>旧密码：</label>
                            <div class="col-sm-7">
                                <input id="oldPassword" type="password" name="" class="form-control"
                                       placeholder="请输入旧密码">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-4 control-label"><b class="red">*</b>新密码：</label>
                            <div class="col-sm-7">
                                <input id="newPassword" type="password" name="" class="form-control"
                                       placeholder="请输入新密码">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-4 control-label"><b class="red">*</b>确认密码：</label>
                            <div class="col-sm-7">
                                <input id="newPassword2" type="password" name="" class="form-control"
                                       placeholder="请输入确认密码">
                            </div>
                        </div>

                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" id="btnAddSave">保存</button>
                </div>
            </div>
        </div>
    </div>
    <!--修改密码弹窗end-->



    <!--右侧部分开始-->
    <div id="page-wrapper" class="gray-bg dashbard-1">
        <div class="row border-bottom header-zd">
            <nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
                <div class="navbar-header">
                    <a class="navbar-minimalize minimalize-styl-2 btn" href="#"><i class="fa fa-bars"></i>
                    </a>
                    <p class="text-title">睿控日化智造MAMES系统</p>
                </div>
                <ul class="nav navbar-top-links navbar-right">
                    <li class="dropdown">
                        <a class="fullscreen" title="全屏按钮"><i class="fa fa-arrows-alt"></i>全屏</a>
                    </li>
                    <li class="dropdown">
                        <a class="roll-nav roll-right" id="exit" title="退出"><i class="fa fa fa-sign-out"></i>退出</a>
                    </li>
                </ul>
            </nav>
        </div>
        <div class="row content-tabs tab-zd">
            <!--<a class="navbar-minimalize minimalize-styl-2 btn btn-primary" href="#"><i class="fa fa-bars"></i></a>-->
            <button class="roll-nav roll-left J_tabLeft"><i class="fa fa-backward"></i></button>
            <nav class="page-tabs J_menuTabs">
                <div class="page-tabs-content">
                    <a href="javascript:;" class="active J_menuTab homePage" data-id="/view/home">原料管理</a>
                </div>
            </nav>
            <button class="roll-nav roll-right J_tabRight"><i class="fa fa-forward"></i></button>
            <div class="btn-group roll-nav roll-right">
                <button class="dropdown J_tabClose" data-toggle="dropdown">关闭操作<span class="caret"></span></button>
                <ul role="menu" class="dropdown-menu dropdown-menu-right">
                    <li class="J_tabShowActive"><a>定位当前选项卡</a></li>
                    <li class="divider"></li>
                    <li class="J_tabCloseAll"><a>关闭全部选项卡</a></li>
                    <li class="J_tabCloseOther"><a>关闭其他选项卡</a></li>
                </ul>
            </div>
            <a href="javascript:void(0);" class="roll-nav roll-right tabReload"><i class="fa fa-refresh"></i> 刷新</a>

        </div>

        <div class="row J_mainContent" id="content-main">
            <iframe class="J_iframe" name="iframe0" width="100%" height="100%" th:src="@{/view/material}" frameborder="0"
                    data-id="/view/home" seamless></iframe>
        </div>



            <div class="pull-right" style="
                position:fixed; bottom:0; right:40%;">&copy; 技术支持: 睿控科技 &nbsp;&nbsp;联系电话：0510-85386917
            </div>

    </div>
    <!--右侧部分结束-->

</div>


<!-- 全局js -->
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>
<script th:src="@{/js/plugins/metisMenu/jquery.metisMenu.js}"></script>
<script th:src="@{/js/plugins/slimscroll/jquery.slimscroll.min.js}"></script>
<script th:src="@{/js/plugins/layer/layer.min.js}"></script>

<script th:src="@{/js/app.js}" type="text/javascript"></script>


<!-- 自定义js -->
<script th:src="@{/js/hplus.js}"></script>
<script th:src="@{/js/contabs.js}" type="text/javascript"></script>

<!-- 第三方插件 -->
<script th:src="@{/js/plugins/pace/pace.min.js}"></script>

<!--提示框-->
<script th:src="@{/js/plugins/layer/layer.min.js}"></script>

<script type="text/javascript">

    var  personnelId;
    $(function () {

        $("#exit").click(function () {
            PostWebApi("loginOut", {}).done(function (data) {
                if (data.code === 0) {
                    location.href = "/dazhi/view/login";
                    localStorage.removeItem("publicPath");
                } else {
                    layer.msg('操作失败');
                }
            })
        });

        PostWebApi("getPersonnel", function (data) {
            if (data.code === 0) {
                var personnel = data.data;
                $("#account").html(personnel.personnelName);
                $("#roleName").html(personnel.roleName);
                $("#accountChange").val(personnel.account)
                personnelId=personnel.personnelId

                getMenuData(personnel.personnelId);
            } else {
                //TODO 查询失败，弹出提示框，点击确定后跳转到登录页面
                location.href = "/dazhi/view/login"
            }
        });

        function getMenuData(personnelId) {

            PostWebApi("permissions", {personnelId: personnelId}).done(function (data) {
                if (data.code === 0) {
                    InitMenu(data.data);
                } else {
                    console.log("获取失败222");
                    //TODO 查询失败，弹出提示框，点击确定后跳转到登录页面
                    location.href = "/dazhi/view/login"
                }
            });
        }

        function InitMenu(data) {
            var $menu = $("#side-menu"), $menuHeader = $menu.children("li.nav-header");

            $menu.empty();
            $menu.append($menuHeader);

            SubMenu($menu, data);

            $menu.metisMenu();

        }

        // function SubMenu($ul, data) {
        //     for (var i = 0; i < data.length; i++) {
        //         var item = data[i];
        //         var $li = $("<li></li>");
        //
        //         var itemChilds = item.permissions;
        //         if (itemChilds.length !== 0) {
        //             if (item.permission.permissionName != "设备看板" && item.permission.permissionName != "称料看板" && item.permissionName == "配制看板") {
        //                 $li.append('<a href="' + item.permission.permissionUrl + '"><i class="' + item.permission.icon + '"></i><span class="nav-label">' + item.permission.permissionName + '</span><span class="fa arrow"></span></a>');
        //             }
        //
        //             var $subul = $('<ul></ul>');
        //             $subul.addClass('nav nav-second-level collapse');//collapse
        //             for (var j = 0; j < itemChilds.length; j++) {
        //                 var itemChild = itemChilds[j];
        //                 var $subli = $("<li></li>");
        //                 if (itemChild.permissionName == "能源看板" || itemChild.permissionName == "称料看板" || itemChild.permissionName == "配制看板") {
        //                     console.log(itemChild.permissionName)
        //                     $subli.append('<a target="_blank" href="' + itemChild.permissionUrl + '"><i class="' + item.permission.icon + '" style="transform:scale(0.8);"></i><span class="nav-label">' + itemChild.permissionName + '</span></a>');
        //                 }
        //                     // if(itemChild.permissionName==="能源看板"){
        //                     //     $subli.append('<a class="J_menuItem" href="' + itemChild.permissionUrl + '" data-index="0">' + itemChild.permissionName + '</a>');
        //                     // }
        //                     // if(itemChild.permissionName==="订单列表"){
        //                     //     $subli.append('<a class="J_menuItem" href="' + itemChild.permissionUrl + '" data-index="0">' + itemChild.permissionName + '</a>');
        //                     // }else{
        //                     //     $subli.append('<a class="J_menuItem" href="' + itemChild.permissionUrl + '">' + itemChild.permissionName + '</a>');
        //                 // }
        //                 else {
        //                     $subli.append('<a class="J_menuItem" href="' + itemChild.permissionUrl + '"><i class="' + item.permission.icon + '" style="transform:scale(0.8);"></i><span class="nav-label">' + itemChild.permissionName + '</span></a>');
        //                 }
        //                 $subul.append($subli);
        //             }
        //             $li.append($subul);
        //         } else {
        //             $li.append('<a class="J_menuItem" href="' + item.permission.permissionUrl + '"><i class="' + item.permission.icon + '"></i><span class="nav-label">' + item.permission.permissionName + '</span></a>');
        //         }
        //         $ul.append($li);
        //     }
        //     applyPath(url);
        // }

        function SubMenu($ul, data) {
            for (var i = 0; i < data.length; i++) {
                var item = data[i];
                var $li = $("<li></li>");

                var itemChilds = item.permissions;
                if (itemChilds.length !== 0) {
                    if (item.permission.permissionName!="看板"){
                        $li.append('<a href="' + item.permission.permissionUrl + '"><i class="' + item.permission.icon + '"></i><span class="nav-label">' + item.permission.permissionName + '</span><span class="fa arrow"></span></a>');
                    }

                    var $subul = $('<ul></ul>');
                    $subul.addClass('nav nav-second-level collapse');//collapse
                    for (var j = 0; j < itemChilds.length; j++) {
                        var itemChild = itemChilds[j];
                        var $subli = $("<li></li>");
                        if (itemChild.permissionName=="设备看板"|| itemChild.permissionName == "称料看板" || itemChild.permissionName == "配制看板")
                        {
                            console.log(itemChild.permissionName)
                            $subli.append('<a target="_blank" href="' + itemChild.permissionUrl + '"><i class="' + item.permission.icon + '" style="transform:scale(0.8);"></i><span class="nav-label">' + itemChild.permissionName + '</span></a>');
                        }
                            // if(itemChild.permissionName==="能源看板"){
                            //     $subli.append('<a class="J_menuItem" href="' + itemChild.permissionUrl + '" data-index="0">' + itemChild.permissionName + '</a>');
                            // }
                            // if(itemChild.permissionName==="订单列表"){
                            //     $subli.append('<a class="J_menuItem" href="' + itemChild.permissionUrl + '" data-index="0">' + itemChild.permissionName + '</a>');
                            // }else{
                            //     $subli.append('<a class="J_menuItem" href="' + itemChild.permissionUrl + '">' + itemChild.permissionName + '</a>');
                        // }
                        else{
                            $subli.append('<a class="J_menuItem" href="' + itemChild.permissionUrl + '"><i class="' + item.permission.icon + '" style="transform:scale(0.8);"></i><span class="nav-label">' + itemChild.permissionName + '</span></a>');
                        }
                        $subul.append($subli);
                    }
                    $li.append($subul);
                } else {
                    $li.append('<a class="J_menuItem" href="' + item.permission.permissionUrl + '"><i class="' + item.permission.icon + '"></i><span class="nav-label">' + item.permission.permissionName + '</span></a>');
                }
                $ul.append($li);
            }
            applyPath(url);
        }

    });



    function initTotal(){
        $("#changePassword").modal("show");
    }



    //修改密码
    $("#btnAddSave").click(function () {
        var reg=/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,12}$/;

        var account = $.trim($("#accountChange").val());
        var oldPassword = $.trim($("#oldPassword").val());
        var newPassword = $.trim($("#newPassword").val());
        var newPassword2 = $.trim($("#newPassword2").val());


        if(!account){
            layer.msg("请输入登录账号");
            return false;
        }
        if(!oldPassword){
            layer.msg("请输入旧密码");
            return false;
        }
        if(!newPassword){
            layer.msg("请输入新密码");
            return false;
        } else if(!reg.test(newPassword)||newPassword.length<6||newPassword.length>12){
            layer.msg("密码必须为6-12位的数字和字母的组合");
            return false;
        }
        if(!newPassword2){
            layer.msg("请输入确认密码");
            return false;
        }else if(!reg.test(newPassword2)||newPassword2.length<6||newPassword2.length>12){
            layer.msg("密码必须为6-12位的数字和字母的组合");
            return false;
        }
        if(newPassword != newPassword2){
            layer.msg("两次输入密码不一致！");
            return false;
        }

        PostWebApi("changePassword",
            {
                account: account,
                personnelId: personnelId,
                oldPassword: oldPassword,
                newPassword: newPassword,
                newPassword2: newPassword2
            },function (data) {
                if(data.code===0){
                    layer.msg(data.msg);
                    window.location.href = "/dazhi/view/login";
                }else {
                    layer.msg(data.msg);
                }
            })

    })
</script>

<script>
    // 是否页签与菜单联动
    var isLinkage = true;

    // 历史访问路径缓存
    var url = localStorage.getItem("publicPath");

    /** 刷新时访问路径页签 */
    function applyPath(url) {
        var $dataObj = $('a[href$="' + decodeURI(url) + '"]');
        $dataObj.click();
        if (!$dataObj.hasClass("noactive")) {
            $dataObj.parent("li").addClass("selected").parents("li").addClass("active").end().parents("ul").addClass("in");
        }
    }

    /*setTimeout(function () {
        $("#side-menu li a").click(function () {
            $(this).parent('li').parent().parent().siblings('li').find('a').removeClass('selectedActive');
            $(this).parent('li').siblings('li').find('a').removeClass('selectedActive');
            $(this).addClass('selectedActive');
        });
    },1000)*/
</script>

<!--全屏显示-->
<script>
    //进行切换
    var fullScreenClickCount = 0;
    //调用各个浏览器提供的全屏方法
    var handleFullScreen = function () {
        var de = document.documentElement;

        if (de.requestFullscreen) {
            de.requestFullscreen();
        } else if (de.mozRequestFullScreen) {
            de.mozRequestFullScreen();
        } else if (de.webkitRequestFullScreen) {
            de.webkitRequestFullScreen();
        } else if (de.msRequestFullscreen) {
            de.msRequestFullscreen();
        } else {
            wtx.info("当前浏览器不支持全屏！");
        }

    };
    //调用各个浏览器提供的退出全屏方法
    var exitFullscreen = function () {
        if (document.exitFullscreen) {
            document.exitFullscreen();
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if (document.webkitExitFullscreen) {
            document.webkitExitFullscreen();
        }
    }
    $(".fullscreen").click(function () {
        if (fullScreenClickCount % 2 == 0) {
            handleFullScreen();
        } else {
            exitFullscreen();
        }
        fullScreenClickCount++;
    });
</script>
</body>

</html>
